<!-- Horizontal Form -->
 <div class="box box-info">
      <div class="box-header with-border">
        <h3 class="box-title">退货申请</h3>
        <h3 class="msg"></h3>
      </div>
      <!-- /.box-header -->
      <!-- form start -->
      <form class="form-horizontal">
        <div class="box-body">

          <div class="form-group">
            <label for="brandId" class="col-sm-2 control-label">商品ID</label>
            <div class="col-sm-10">
              <input type="text" name="brandId" class="form-control" id="brandId">
            </div>
          </div>
          <div class="form-group">
            <label for="brandNameId" class="col-sm-2 control-label">商品名称</label>
            <div class="col-sm-10">
              <input type="text" name="brandName" class="form-control" id="brandNameId">
            </div>
          </div>
          <div class="form-group">
            <label for="priceId" class="col-sm-2 control-label">价格</label>
            <div class="col-sm-10">
              <input type="text" name="price" class="form-control" id="priceId">
            </div>
          </div>
          <div class="form-group">
            <label for="addrId" class="col-sm-2 control-label">收货地址</label>
            <div class="col-sm-10">
              <input type="text" name="addr" class="form-control" id="addrId">
            </div>
          </div>
          <div class="form-group">
            <label for="nameId" class="col-sm-2 control-label">收货人</label>
            <div class="col-sm-10">
              <input type="text" name="name" class="form-control" id="nameId">
            </div>
          </div>
          <div class="form-group">
            <label for="telId" class="col-sm-2 control-label">手机号</label>
            <div class="col-sm-10">
              <input type="text" name="tel" class="form-control" id="telId">
            </div>
          </div>

          <div class="form-group">
            <label for="reasonId" class="col-sm-2 control-label">退货原因</label>
            <div class="col-sm-10">
              <input type="text" class="form-control load-sys-reason" readonly="readonly" id="reasonId" placeholder="父类原因">
            </div>
          </div>
          
          <div class="form-group">
            <label for="describesId" class="col-sm-2 control-label">处理描述</label>
            <div class="col-sm-10">
              <input type="text" name="describes" class="form-control"  id="describesId">
            </div>
          </div>

        </div>
        <!-- /.box-body -->
        <div class="box-footer">
          <button type="button" class="btn btn-default btn-cancel">Cancel</button>
          <button type="button" class="btn btn-info pull-right btn-save">Save</button>
        </div>
        <!-- /.box-footer -->
      </form>
     <div class="layui-layer layui-layer-page layui-layer-molv layer-anim" id="treeLayer" type="page" times="2" showtime="0" contype="object"
		style="z-index:59891016; width: 300px; height: 450px; top: 100px; left: 500px; display:none">
		<div class="layui-layer-title" style="cursor: move;">选择退货原因</div>
		<div class="layui-layer-content" style="height: 358px;">
			<div style="padding: 10px;" class="layui-layer-wrap">
				<ul id="zTreeId" class="ztree"></ul>    <!-- 动态加载树 -->
			</div>
		</div>
		<span class="layui-layer-setwin"> <a class="layui-layer-ico layui-layer-close layui-layer-close1 btn-cancel" ></a></span>
		<div class="layui-layer-btn layui-layer-btn-">
			<a class="layui-layer-btn0 btn-confirm">确定</a>
			<a class="layui-layer-btn1 btn-cancel">取消</a>
	     </div>
      </div>
    </div>
<script type="text/javascript" src="bower_components/ztree/jquery.ztree.all.min.js"></script>
<script type="text/javascript" src="bower_components/layer/layer.js"></script>
<script type="text/javascript">
 var zTree; 
 //初始化zTree时会用到
 var setting = {
	data : {
		simpleData : {
			enable : true,
			idKey : "id",  //节点数据中保存唯一标识的属性名称
			pIdKey : "parentId",  //节点数据中保存其父节点唯一标识的属性名称
			rootPId : null  //根节点id
		}//json 格式javascript对象
	}
 }//json 格式的javascript对象
 $(document).ready(function(){


	 //事件注册
	 $(".box-footer")
	 .on("click",".btn-cancel",doCancel)
	 .on("click",".btn-save",doSave);
	 
	  $("#treeLayer")
	  .on("click",".btn-cancel",doHideTree)
	  .on("click",".btn-confirm",doConfirm);
	 
	 $(".form-horizontal")
	 .on("click",".load-sys-reason",doLoadZTreeNodes);
 });
 function doHideTree(){
	  $("#treeLayer").css("display","none");
 }
 //确定按钮
 function doConfirm(){
	  //1.获取选中的记录(id,name);
	  var selectedNodes=zTree.getSelectedNodes();
	  var node=selectedNodes[0];
	  //2.将id和name填写或绑定在具体对象上
	  $("#reasonId").val(node.name);
	  console.log("node.id="+node.id)
	  $("#reasonId").data("reasonId",node.id)
	  //3.隐藏zTree对应的Div
	  doHideTree();
 }
 
 function doLoadZTreeNodes(){
	  var url="reason/doFindZTreeNodes";
	  $("#treeLayer").css("display","block");
	  $.getJSON(url,function(result){
		  if(result.state==1){
			  zTree = $.fn.zTree.init($("#zTreeId"),setting,result.data);
		  }else{
			  alert(result.message);
		  }
	  });
 }
 function doCancel(){
	$("#mainContentId").removeData("rowData");
	$("#mainContentId").load("sale/sale_list");
 }
 function doSave(){
	 var rowData=$("#mainContentId").data("rowData");
	 //1.获取表单数据
	 var params=doGetEditFormData();
	 if(rowData)params.id=rowData.user.id;
	 //2.发起异步请求
	 var insertUrl="sale/doSaveObject";

	 var url=insertUrl;
	 console.log(params);
	 $.post(url,params,function(result){
		 if(result.state==1){
			 alert(result.message);
			 doCancel();
		 }else{
			alert(result.message);
		 }
	 })
 }
 function doGetEditFormData(){
	 //获取用户输入的数据
	 var params={
	    brandId:$("#brandId").val(),
	    brandName:$("#brandNameId").val(),
	    price:$("#priceId").val(),
	    addr:$("#addrId").val(),
	    name:$("#nameId").val(),
	    tel:$("#telId").val(),
       reasonId:$("#reasonId").data("reasonId"),
       describes:$("#describesId").val()
	 }

	 return params;
 }

</script>
    
    
    
    
    
    
    